<!--
 * @Author: Leo.wang wanglizhigs@163.com
 * @Date: 2023-12-24 11:10:30
 * @LastEditors: Leo.wang wanglizhigs@163.com
 * @LastEditTime: 2023-12-24 12:36:45
 * @FilePath: /tuberculosis_screening_display_system/src/components/StackedChart/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<!--
 * @Author: Leo.wang wanglizhigs@163.com
 * @Date: 2023-12-06 22:31:42
 * @LastEditors: Leo.wang wanglizhigs@163.com
 * @LastEditTime: 2023-12-24 10:52:46
 * @FilePath: /tuberculosis_screening_display_system/src/components/Schedule.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="p_default">
    <div ref="containerRef" class="chart-container" :style="{ height: height - 18*2 + 'px' }"></div>
  </div>
</template>

<script lang="ts">
import { defineComponent  } from 'vue';
import { useGeneralChart } from './hooks';

export default defineComponent({
  name: 'StackedChart',
  props: {
    title: String,
    subTitle: String,
    data: {
      type: Array,
      default: [],
    },
    legend:{
      type: Array,
      default: [],
    },
    label: String,
    height: {
      type: Number,
      default: 200,
    }
  },
  setup(props, context) {
   

    const { containerRef } = useGeneralChart(props, context);
    return {
      containerRef,
    };
  },
});
</script>

<style lang="scss" scoped>
.chart-container {
  position: relative;

}
</style>

